<template>
  <div class="wechat">
    <!-- 卡片视图区域 -->
    <div class="wechat_card">
      <!--搜索框与按钮-->
      <el-row :gutter="20"
              class="wechat_card_head"
              type="flex">
        <el-col :span="6">

          <el-input placeholder="输入设备名称查询"
                    size="medium"
                    v-model="queryInfo.query"
                    clearable
                    @clear="getTableList">
            <el-button slot="append"
                       size="medium"
                       icon="el-icon-search"
                       @click="getTableList"></el-button>
          </el-input>
        </el-col>

        <el-button v-has="'6211'"
                   size="medium"
                   class="btn_head_medium"
                   type="primary"
                   @click="addDialogVisible=true"
                   icon="el-icon-circle-plus-outline">新增</el-button>

        <el-button v-has="'6212'"
                   size="medium"
                   type="danger"
                   @click="deleteRecordByIds"
                   icon="el-icon-remove-outline">删除</el-button>

        <el-select class="select_head_medium"
                   size="medium"
                   v-model="statusValue"
                   @change="selectChange"
                   clearable
                   collapse-tags
                   placeholder="按设备状态筛选"
                   style="margin-left: 20px;">
          <el-option label="维修中"
                     value="0"></el-option>
          <el-option label="正常运行"
                     value="1"></el-option>
          <el-option label="已报废"
                     value="2"></el-option>
        </el-select>
        <!-- 表格列筛选和导出 -->
        <div class="tools_head">
          <el-popover placement="right"
                      trigger="click">
            <el-checkbox-group v-model="tableFilterData.checkBoxList">
              <template v-for="(item, i) in tableFilterData.dataNow">
                <el-checkbox :label="item.attr"
                             :key="i"
                             :checked="item.checked"
                             style="display: block;margin:10px;"
                             @change="filterFunHandle('filter',item.attr,i)">
                  {{item.label}}
                </el-checkbox>
              </template>
            </el-checkbox-group>
            <div slot="reference">
              <el-tooltip content="筛选列"
                          placement="bottom">
                <el-button size="small"
                           icon="el-icon-menu"></el-button>
              </el-tooltip>
            </div>
            <el-button size="small"
                       type="text"
                       @click="filterFunHandle('allchecked')">全选</el-button>
            <el-button size="small"
                       type="text"
                       @click="filterFunHandle('cancel')">取消全选</el-button>
          </el-popover>

          <el-tooltip content="导出excel"
                      placement="bottom">
            <el-button size="small"
                       icon="el-icon-download"
                       style="margin-left: 10px"
                       @click="exportDataToExcel"></el-button>
          </el-tooltip>
        </div>

      </el-row>
      <!-- 表格区域 -->
      <el-table :data="tableFilterData.dataList"
                style="width: 100%"
                height="85%"
                border
                stripe
                size="small"
                :key="Math.random()"
                :header-cell-style="{ textAlign: 'center' }"
                :cell-style="{ textAlign: 'center' }"
                @selection-change="handleSelectionChange">
        <el-table-column type="selection">
        </el-table-column>
        <!-- 序号列 -->
        <el-table-column type="index"
                         label="序号"></el-table-column>
        <!-- 依次渲染表格的每列 -->
        <template v-for="(col,index) in tableFilterData.dataNow">
          <!-- 如果当前列的attr为普通类型，渲染内容即可(页面中有两个v-for,:key应不同以解决key值冲突问题) -->
          <el-table-column :key="index+'a'"
                           v-if="col.checked===true && col.attr!=='state' && col.attr!=='type'&&col.attr!=='manufacturer'&& col.attr!=='price'&& col.attr!=='position'&& col.attr!=='limitDate'&& col.attr!=='scrapDate'&& col.attr!=='buyDate'&& col.attr!=='useDate'"
                           align="center"
                           :prop="col.attr"
                           :label="col.label"
                           min-width="110">
          </el-table-column>
          <!-- 如果当前列的attr为type，渲染为标签形式 -->
          <el-table-column :key="index"
                           v-if="col.checked===true &&col.attr==='state'"
                           :label="col.label"
                           :prop="col.attr"
                           width="100"
                           :filters="[{ text: '维修中', value: 0 }, { text: '正常运行', value: 1 }, { text: '报废', value: 2 }]"
                           :filter-method="filterState"
                           filter-placement="bottom-end">
            <template slot-scope="scope">
              <el-tag v-if="scope.row.state == '0'"
                      type="warning"
                      size="mini">维修中</el-tag>
              <el-tag v-if="scope.row.state == '1'"
                      type="success"
                      size="mini">正常运行</el-tag>
              <el-tag v-if="scope.row.state == '2'"
                      type="danger"
                      size="mini">报废</el-tag>
            </template>
          </el-table-column>
          <!-- 如果当前列的attr为manufacturer，将manufacturer内容渲染为标签形式 -->
          <el-table-column :key="index"
                           v-if="col.checked===true &&col.attr==='manufacturer'"
                           :label="col.label"
                           :prop="col.attr">
            <template slot-scope="scope">
              <el-tag>{{scope.row.manufacturer}}</el-tag>
            </template>
          </el-table-column>
          <!-- 如果当前列的attr为url，渲染为图片形式 -->
          <el-table-column :key="index"
                           v-if="col.checked===true &&col.attr==='url' "
                           :label="col.label"
                           :prop="col.attr">
            <template slot-scope="scope">
              <el-image style="width: 100px; height: 100px"
                        :src="scope.row.url"
                        :fit="'contain'"
                        :preview-src-list="[scope.row.url]">
              </el-image>
            </template>
          </el-table-column>

          <!-- 对各列长度进行控制 -->
          <el-table-column :key="index+'a'"
                           v-if="col.checked===true && col.attr=='price' "
                           align="center"
                           :prop="col.attr"
                           :label="col.label"
                           width="80">
          </el-table-column>
          <el-table-column :key="index+'a'"
                           v-if="col.checked===true && col.attr=='position' "
                           align="center"
                           :prop="col.attr"
                           :label="col.label"
                           width="140">
          </el-table-column>
          <el-table-column :key="index+'a'"
                           v-if="col.checked===true && col.attr=='limitDate' "
                           align="center"
                           :prop="col.attr"
                           :label="col.label"
                           width="80">
          </el-table-column>
          <el-table-column :key="index+'a'"
                           v-if="col.checked===true && col.attr=='scrapDate' "
                           align="center"
                           :prop="col.attr"
                           :label="col.label"
                           width="180">
          </el-table-column>
          <el-table-column :key="index+'a'"
                           v-if="col.checked===true && col.attr=='buyDate' "
                           align="center"
                           :prop="col.attr"
                           :label="col.label"
                           width="180">
          </el-table-column>
          <el-table-column :key="index+'a'"
                           v-if="col.checked===true && col.attr=='useDate' "
                           align="center"
                           :prop="col.attr"
                           :label="col.label"
                           width="180">
          </el-table-column>

        </template>

        <el-table-column label="操作"
                         fixed="right"
                         width="180px">
          <template slot-scope="scope">
            <!-- 编辑按钮 -->
            <el-button v-has="'6213'"
                       type="primary"
                       icon="el-icon-edit"
                       size="mini"
                       @click="showEditDialog(scope.row.id)"></el-button>
            <!-- 删除按钮 -->
            <el-button v-has="'6214'"
                       type="danger"
                       icon="el-icon-delete"
                       size="mini"
                       @click="deleteRecordById(scope.row.id)"></el-button>

          </template>
        </el-table-column>

      </el-table>

      <!-- 分页 -->
      <el-pagination @size-change="handleSizeChange"
                     @current-change="handleCurrentChange"
                     :current-page="this.queryInfo.pageNum"
                     :page-sizes="[3, 6, 10, 12]"
                     :page-size="this.queryInfo.pageSize"
                     layout="total, sizes, prev, pager, next, jumper"
                     :total="total"></el-pagination>

      <!-- 添加记录的对话框 -->
      <el-dialog title="添加设备信息"
                 :visible.sync="addDialogVisible"
                 @close="addDialogClosed"
                 width="50%">
        <!-- 内容主体区 -->
        <el-form :model="addForm"
                 :rules="addFormRules"
                 ref="addFormRef"
                 label-width="100px"
                 label-position="right"
                 inline="true">
          <el-form-item label="设备编号"
                        prop="equipmentNo">
            <el-input v-model="addForm.equipmentNo"></el-input>
          </el-form-item>

          <el-form-item label="二级类型"
                        prop="typeId">

            <el-cascader v-model="addForm.typeId2"
                         :options="typeList"
                         :props="{ expandTrigger: 'hover' }"
                         @change="handleChange"></el-cascader>
          </el-form-item>

          <el-form-item label="型号"
                        prop="specification">
            <el-input v-model="addForm.specification"></el-input>
          </el-form-item>

          <el-form-item label="设备名称"
                        prop="name">
            <el-input v-model="addForm.name"></el-input>
          </el-form-item>

          <el-form-item label="生产厂家"
                        prop="manufacturer">
            <el-input v-model="addForm.manufacturer"></el-input>
          </el-form-item>

          <el-form-item label="购买价格"
                        prop="price">
            <el-input v-model="addForm.price"
                      placeholder="单位：元"></el-input>
          </el-form-item>

          <el-form-item label="购买日期"
                        prop="buyDate">
            <el-date-picker v-model="addForm.buyDate"
                            type="date"
                            placeholder="请选择购买日期"
                            format="yyyy 年 MM 月 dd 日"
                            value-format="yyyy-MM-dd">
            </el-date-picker>
          </el-form-item>

          <el-form-item label="使用日期"
                        prop="useDate">
            <el-date-picker v-model="addForm.useDate"
                            type="date"
                            placeholder="请选择使用日期"
                            format="yyyy 年 MM 月 dd 日"
                            value-format="yyyy-MM-dd">
            </el-date-picker>
          </el-form-item>

          <el-form-item label="使用期限"
                        prop="limitDate">
            <el-input v-model="addForm.limitDate"
                      placeholder="单位：年"></el-input>
          </el-form-item>

          <el-form-item label="报废日期"
                        prop="scrapDate">
            <el-date-picker v-model="addForm.scrapDate"
                            type="date"
                            placeholder="请选择报废日期"
                            format="yyyy 年 MM 月 dd 日"
                            value-format="yyyy-MM-dd">
            </el-date-picker>
          </el-form-item>

          <el-form-item label="保修时长"
                        prop="repairDate">
            <el-input v-model="addForm.repairDate"
                      placeholder="单位：年"></el-input>
          </el-form-item>

          <el-form-item label="所有权"
                        prop="belongState">
            <el-select v-model="addForm.belongState"
                       placeholder="请选择设备所有权">
              <el-option label="自己所有"
                         value="0"></el-option>
              <el-option label="租用"
                         value="1"></el-option>
            </el-select>
          </el-form-item>

          <el-form-item class="oneLine"
                        label="设备状态"
                        prop="state">
            <el-radio-group v-model="addForm.state">
              <el-radio v-model="addForm.state"
                        :label="0">维修中</el-radio>
              <el-radio v-model="addForm.state"
                        :label="1">正常运行</el-radio>
              <el-radio v-model="addForm.state"
                        :label="2">报废</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="  "></el-form-item>
          <el-form-item label="地址"
                        prop="position">
            <el-input v-model="addForm.position"></el-input>
          </el-form-item>

          <el-form-item label="折旧率"
                        prop="depreciationRate">
            <el-input v-model="addForm.depreciationRate"></el-input>
          </el-form-item>

          <el-form-item label="责任区"
                        prop="areaId">
            <el-input v-model="addForm.areaId"></el-input>
          </el-form-item>

          <el-form-item label="维保部门"
                        prop="repairDepartmentId">
            <el-input v-model="addForm.repairDepartmentId"></el-input>
          </el-form-item>
          <el-form-item label="备注"
                        prop="memo">
            <el-input type="textarea"
                      style="width:280%"
                      v-model="addForm.memo"></el-input>
          </el-form-item>
          <!-- <el-row>
            <el-col span="12"></el-col>
            <el-col span="12"></el-col>
          </el-row>
          <el-form-item label="小区id"
                            prop="communityId">
                <el-input v-model="addForm.communityId"></el-input>
              </el-form-item>
          <el-form-item label="添加人"
                        prop="addUserId">
            <el-input v-model="addForm.addUserId"></el-input>
          </el-form-item>
          <el-form-item label="添加时间"
                        prop="addTime">
            <el-input v-model="addForm.addTime"></el-input>
          </el-form-item> -->

        </el-form>
        <!-- 底部区域 -->
        <span slot="footer"
              class="dialog-footer">
          <el-button @click="addDialogVisible = false">取 消</el-button>
          <el-button type="primary"
                     @click="addRecord">确 定</el-button>
        </span>
      </el-dialog>
      <!-- 修改记录对话框 -->
      <el-dialog title="修改设备信息"
                 :visible.sync="editDialogVisible"
                 @close="editDialogClosed"
                 width="50%">
        <!-- 内容主体区 -->
        <el-form :model="editForm"
                 :rules="editFormRules"
                 ref="editFormRef"
                 label-width="100px"
                 label-position="right"
                 inline="true">

          <el-form-item label="设备编号"
                        prop="equipmentNo">
            <el-cascader v-model="editForm.typeId"
                         :options="typeList"
                         :props="{ expandTrigger: 'hover' }"
                         @change="handleChange"></el-cascader>
          </el-form-item>

          <el-form-item label="二级类型"
                        prop="typeId">

            <el-cascader v-model="editForm.typeId2"
                         :options="typeList"
                         :props="{ expandTrigger: 'hover' }"
                         @change="handleChange"></el-cascader>
          </el-form-item>

          <el-form-item label="型号"
                        prop="specification">
            <el-input v-model="editForm.specification"></el-input>
          </el-form-item>

          <el-form-item label="设备名称"
                        prop="name">
            <el-input v-model="editForm.name"></el-input>
          </el-form-item>

          <el-form-item label="生产厂家"
                        prop="manufacturer">
            <el-input v-model="editForm.manufacturer"></el-input>
          </el-form-item>

          <el-form-item label="购买价格"
                        prop="price">
            <el-input v-model="editForm.price"
                      placeholder="单位：元"></el-input>
          </el-form-item>

          <el-form-item label="购买日期"
                        prop="buyDate">
            <el-date-picker v-model="editForm.buyDate"
                            type="date"
                            placeholder="请选择购买日期"
                            format="yyyy 年 MM 月 dd 日"
                            value-format="yyyy-MM-dd">
            </el-date-picker>
          </el-form-item>

          <el-form-item label="使用日期"
                        prop="useDate">
            <el-date-picker v-model="editForm.useDate"
                            type="date"
                            placeholder="请选择使用日期"
                            format="yyyy 年 MM 月 dd 日"
                            value-format="yyyy-MM-dd">
            </el-date-picker>
          </el-form-item>

          <el-form-item label="使用期限"
                        prop="limitDate">
            <el-input v-model="editForm.limitDate"
                      placeholder="单位：年"></el-input>
          </el-form-item>

          <el-form-item label="报废日期"
                        prop="scrapDate">
            <el-date-picker v-model="editForm.scrapDate"
                            type="date"
                            placeholder="请选择报废日期"
                            format="yyyy 年 MM 月 dd 日"
                            value-format="yyyy-MM-dd">
            </el-date-picker>
          </el-form-item>

          <el-form-item label="保修时长"
                        prop="repairDate">
            <el-input v-model="editForm.repairDate"
                      placeholder="单位：年"></el-input>
          </el-form-item>

          <el-form-item label="所有权"
                        prop="belongState">
            <el-select v-model="editForm.belongState"
                       placeholder="请选择设备所有权">
              <el-option label="自己所有"
                         value="0"></el-option>
              <el-option label="租用"
                         value="1"></el-option>
            </el-select>
          </el-form-item>

          <el-form-item class="oneLine"
                        label="设备状态"
                        prop="state">
            <el-radio-group v-model="editForm.state">
              <el-radio v-model="editForm.state"
                        :label="0">维修中</el-radio>
              <el-radio v-model="editForm.state"
                        :label="1">正常运行</el-radio>
              <el-radio v-model="editForm.state"
                        :label="2">报废</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="  "></el-form-item>
          <el-form-item label="地址"
                        prop="position">
            <el-input v-model="editForm.position"></el-input>
          </el-form-item>

          <el-form-item label="折旧率"
                        prop="depreciationRate">
            <el-input v-model="editForm.depreciationRate"></el-input>
          </el-form-item>

          <el-form-item label="责任区"
                        prop="areaId">
            <el-input v-model="editForm.areaId"></el-input>
          </el-form-item>

          <el-form-item label="维保部门"
                        prop="repairDepartmentId">
            <el-input v-model="editForm.repairDepartmentId"></el-input>
          </el-form-item>

          <el-form-item label="备注"
                        prop="memo">
            <el-input type="textarea"
                      style="width:280%"
                      v-model="editForm.memo"></el-input>
          </el-form-item>

        </el-form>
        <span slot="footer"
              class="dialog-footer">
          <el-button @click="editDialogVisible = false">取 消</el-button>
          <el-button type="primary"
                     @click="editRecordInfo">确 定</el-button>
        </span>
      </el-dialog>

    </div>
  </div>
</template>
<script>
import {
  getList,
  add,
  deleteSelected,
  deleteCurrent,
  getEditInfo,
  edit,
  getDetail,
  modifySwitch,
} from "@/api/logistics/logisticsGreen.js";
import axios from 'axios'
import MyDrawer from "../../../components/MyDrawer"
export default {
  components: {
    MyDrawer

  },
  data () {
    return {
      typeList: [{
        value: 1,
        label: '空调',
        children: [{
          value: 101,
          label: '节能型',
        }, {
          value: 102,
          label: '普通型',
        }]
      },
      {
        value: 2,
        label: '油烟机',
        children: [{
          value: 201,
          label: '环保型',
        }, {
          value: 202,
          label: '功能型',
        }, {
          value: 203,
          label: '高效型',
        }]
      }, {
        value: 3,
        label: '发电机',
        children: [{
          value: 14,
          label: '小型',
        }, {
          value: 15,
          label: '中型',
        }, {
          value: "16",
          label: '大型',
        }]
      }],
      // 表格列筛选数据
      tableFilterData: {
        dataList: [

        ],
        dataNow: [
          { label: "	序号	", attr: "id", checked: false },
          { label: "	设备编号	", attr: "equipmentNo", checked: true },
          { label: "	二级类型编号	", attr: "typeId", checked: false },
          { label: "	型号	", attr: "specification", checked: true },
          { label: "	名称	", attr: "name", checked: true },
          { label: "	厂家	", attr: "manufacturer", checked: false },
          { label: "  购买价格", attr: "price", checked: true },
          { label: "	购买日期	", attr: "buyDate", checked: false },
          { label: "	使用日期	", attr: "useDate", checked: false },
          { label: "	使用期限", attr: "limitDate", checked: true },
          { label: "	报废日期	", attr: "scrapDate", checked: false },
          { label: "	保修期	", attr: "repairDate", checked: false },
          { label: "	所有权	", attr: "belongState", checked: false },
          { label: "	地址	", attr: "position", checked: true },
          { label: "  设备状态 ", attr: "state", checked: true },
          { label: "	折旧率	", attr: "depreciationRate", checked: false },
          // { label: "	维保部门编号	", attr: "repairDepartmentId", checked: false },
          { label: "	维保部门	", attr: "repairDepartmentName", checked: false },
          // { label: "	责任区编号	", attr: "areaId", checked: false },
          { label: "	责任区	", attr: "areaName", checked: false },
          // { label: "	小区id	", attr: "communityId", checked: false },
          { label: "	添加人	", attr: "addUserId", checked: false },
          { label: "	添加时间	", attr: "addTime", checked: false },
          { label: "	备注	", attr: "memo", checked: true },

        ],

        checkLabels: [], // 筛选列显示多选框数据
        checkBoxList: [], // 筛选列数据
        indexTwo: 0,
      },
      // 记录列表分页区的参数
      queryInfo: {
        //搜索条件
        query: "",
        // 当前页码
        pageNum: 1,
        //每页显示条数
        pageSize: 3,
      },
      total: 0,


      // 控制添加记录对话框的显示与隐藏
      addDialogVisible: false,
      // 添加记录的表单数据
      addForm: {

        equipmentNo: "",
        typeId: "",
        specification: "",
        name: "",
        manufacturer: "",
        price: "",
        buyDate: "",
        useDate: "",
        limitDate: "",
        scrapDate: "",
        repairDate: "",
        belongState: "",
        position: "",
        state: "",
        depreciationRate: "",
        repairDepartmentId: "",
        areaId: "",
        communityId: "",
        addUserId: "",
        addTime: "",
        memo: "",

      },
      // 添加表单校验规则
      addFormRules: {
        equipmentNo: [
          { required: true, message: '请输入设备编号', trigger: 'blur' },
          { min: 3, max: 25, message: '设备编号长度在3到25个字符串之间', trigger: 'blur' }
        ],
        name: [
          { required: true, message: '请输入设备名称', trigger: 'blur' },
          { min: 1, max: 25, message: '设备名称长度在3到25个字符串之间', trigger: 'blur' }
        ],

      },


      // 控制修改用户对话框的显示与隐藏
      editDialogVisible: false,
      // 查询到的用户信息
      editForm: {
        equipmentNo: "",
        typeId: "",
        specification: "",
        name: "",
        manufacturer: "",
        price: "",
        buyDate: '',
        useDate: "",
        limitDate: "",
        scrapDate: "",
        repairDate: "",
        belongState: "",
        position: "",
        state: "",
        depreciationRate: "",
        repairDepartmentId: "",
        areaId: "",
        communityId: "",
        addUserId: "",
        addTime: "",
        memo: "",

      },
      // 编辑表单校验规则
      editFormRules: {
        equipmentNo: [
          { required: true, message: '请输入设备编号', trigger: 'blur' },
          { min: 3, max: 25, message: '设备编号长度在3到25个字符串之间', trigger: 'blur' }
        ],
        name: [
          { required: true, message: '请输入设备名称', trigger: 'blur' },
          { min: 1, max: 25, message: '设备名称长度在1到25个字符串之间', trigger: 'blur' }
        ],
      },


      // 控制详细信息抽屉的显示与隐藏
      drawerVisible: false,
      // 详细信息的表单数据
      detailForm: {},
      // 被选中的记录id
      selectedList: [],
      selectedStr: {
        ids: "",
      },
      deleteNow: {
        ids: "",
      },
      statusValue: '',
    }
  },
  created () {
    this.getTableList();

  },
  methods: {
    // 获取列表信息
    async getTableList () {
      this.queryInfo = this.getQueryCondition()
      const { data: res } = await this.$http.get("EquipmentinfofileAction/getBasicInfos", { params: this.queryInfo })
      console.log(res)
      if (!res.success) return this.$message.error('获取表格数据失败')
      // this.$message.success('获取列表数据成功')
      this.tableFilterData.dataList = res.rows
      this.total = res.total

    },
    //获取工具栏的各类查询条件：搜索框关键词、筛选框值等
    getQueryCondition () {
      //搜索框筛选
      var search = `equipmentinfofile.name like "%${this.queryInfo.query}%"`;

      // 下拉框筛选
      var state = '';
      if (this.statusValue !== '') {
        state += ` and equipmentinfofile.state='${this.statusValue}'`;
      }

      this.queryInfo.condition = `${search}${state}`
      return this.queryInfo;
    },
    //工具栏的各种下拉框筛选监听
    async selectChange () {
      this.getTableList()
    },

    //监听搜索输入框
    clearData () {
      if (this.queryInfo.query == '') {
        delete this.queryInfo.condition
      }
    },


    // 监听多选框选中的所有记录
    handleSelectionChange (val) {
      // this.selectedList = val;
      this.selectedList = val.map(item => {
        return item.id;
      })
    },
    // 监听pagesize改变的事件
    handleSizeChange (newSize) {
      console.log(newSize)
      this.queryInfo.pageSize = newSize
      this.getTableList()
    },
    // 监听页码值改变的事件
    handleCurrentChange (newPage) {
      console.log(newPage)
      this.queryInfo.pageNum = newPage
      this.getTableList()
    },
    // 监听添加对话框的关闭事件
    addDialogClosed () {
      this.$refs.addFormRef.resetFields()
    },
    // 监听修改对话框的关闭
    editDialogClosed () {
      this.$refs.editFormRef.resetFields()
    },
    // 表头列筛选功能
    filterFunHandle (type, currentItem, index) {
      if (type === 'filter') { // 筛选列
        if (event.target.checked === false) {
          this.tableFilterData.dataNow.forEach((item, index, arr) => {
            if (item.attr === currentItem) {
              return item.checked = false
            }
          })
        } else {
          this.tableFilterData.dataNow.forEach((item, index, arr) => {
            if (item.attr === currentItem) {
              return item.checked = true
            }
          })
        }
      } else if (type === 'allchecked') { // 全选
        if (this.tableFilterData.checkLabels.length === 0) {
          this.tableFilterData.dataNow.forEach((result) => {
            this.tableFilterData.checkLabels.push(result.attr)
          })
          this.tableFilterData.checkBoxList = this.tableFilterData.checkLabels // 复选框置为复选所有值，全部选择    
        } else {
          this.tableFilterData.checkBoxList = this.tableFilterData.checkLabels // 复选框置为复选所有值，全部选择
        }
        this.tableFilterData.dataNow.forEach((item, index, arr) => {
          item.checked = true
        })
      } else if (type === 'cancel') { // 取消全选
        this.tableFilterData.checkBoxList = [] // 复选框置为空，全部不选择
        this.tableFilterData.dataNow.forEach((item, index, arr) => {
          item.checked = false
        })
      }
    },
    // 状态筛选
    filterState (value, row) {
      return row.state === value;
    },






    // 添加记录
    addRecord () {
      this.$refs.addFormRef.validate(async valid => {
        if (!valid) return
        this.addForm.typeId = this.addForm.typeId2[0]
        const { data: res } = await this.$http.post("EquipmentinfofileAction/addObject", this.addForm)
        console.log(res)
        if (!res.success) return this.$message.error('添加失败')
        this.$message.success('添加记录成功！')
        // 隐藏添加记录的对话框
        this.addDialogVisible = false
        // 重新获取记录列表数据
        this.getTableList()



      })
    },
    // addRecord () {
    //   this.$refs.addFormRef.validate(async valid => {
    //     if (!valid) return
    //     // 可以发起添加记录的网络请求
    //     await add(
    //       this.addForm
    //     ).then((res) => {
    //       if (res.meta.status !== 201) {
    //         this.$message.error('添加记录失败！')
    //       }
    //       this.$message.success('添加记录成功！')
    //       // 隐藏添加记录的对话框
    //       this.addDialogVisible = false
    //       // 重新获取记录列表数据
    //       this.getTableList()
    //     })
    //   })
    // },
    // 删除（批量）
    // async deleteRecordByIds () {
    //   // 弹框询问用户是否删除数据
    //   const confirmResult = await this.$confirm('此操作将永久删除记录, 是否继续?', '提示', {
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消',
    //     type: 'warning'
    //   }).catch(err => err)
    //   // 如果用户确认删除，返回值为字符串confirm
    //   // 如果用户取消删除，返回值未字符串cancel
    //   // console.log(confirmResult)
    //   if (confirmResult !== 'confirm') {
    //     return this.$message.info('已经取消删除')
    //   }
    //   console.log(this.selectedList)

    //   await deleteSelected(this.selectedList).then((res) => {
    //     if (res.meta.status !== 200) {
    //       return this.$message.error('删除记录失败！')
    //     }
    //     this.$message.success('删除记录成功！')
    //     this.getTableList()
    //   })

    // },
    async deleteRecordByIds () {
      // 弹框询问用户是否删除数据
      const confirmResult = await this.$confirm('此操作将永久删除记录, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).catch(err => err)
      // 如果用户确认删除，返回值为字符串confirm
      // 如果用户取消删除，返回值未字符串cancel
      // console.log(confirmResult)
      if (confirmResult !== 'confirm') {
        return this.$message.info('已经取消删除')
      }
      // 将selectList数组处理成字符串形式并赋值给selectStr的ids属性
      var str = ""
      for (var i = 0; i < this.selectedList.length - 1; i++) {
        str += this.selectedList[i] + ",";
      }
      str += this.selectedList[this.selectedList.length - 1]
      this.selectedStr.ids = str

      const { data: res } = await this.$http.post("EquipmentinfofileAction/deleteByIds", this.selectedStr)
      if (!res.success) return this.$message.error('删除记录失败！')
      this.$message.success('删除记录成功！')
      this.getTableList()

    },
    // 查看修改记录（当前记录）
    async showEditDialog (id) {
      const { data: res } = await this.$http.post("EquipmentinfofileAction/getObjectById", { id })
      if (!res.success)
        return this.$message.error('获取信息失败')
      this.editForm = res.rows[0]
      // console.log(this.editForm);
      this.editDialogVisible = !this.editDialogVisible

      // await getEditInfo(id).then((res) => {
      //   if (res.meta.status !== 200) {
      //     return this.$message.error('修改信息查询失败！')
      //   }
      //   this.editForm = res.data.data
      //   this.editDialogVisible = true
      // })

    },
    // 确认修改
    editRecordInfo () {
      this.$refs.editFormRef.validate(async valid => {
        if (!valid) return
        // 发起修改记录信息的数据请求
        console.log(this.editForm)
        this.editForm.typeId = this.editForm.typeId2[0]
        const { data: res } = await this.$http.post("EquipmentinfofileAction/updateNoNull", this.editForm)
        if (!res.success) return this.$message.error('更新信息失败！')
        // 关闭对话框
        this.editDialogVisible = false
        // 刷新数据列表
        this.getTableList()
        // 提示修改成功
        this.$message.success('更新信息成功！')

      })
    },
    // 删除（当前记录）
    // async deleteRecordById (id) {
    //   // 弹框询问用户是否删除数据
    //   const confirmResult = await this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消',
    //     type: 'warning'
    //   }).catch(err => err)
    //   // 如果用户确认删除，返回值为字符串confirm
    //   // 如果用户取消删除，返回值未字符串cancel
    //   // console.log(confirmResult)
    //   if (confirmResult !== 'confirm') {
    //     return this.$message.info('已经取消删除')
    //   }
    //   await deleteCurrent(id).then((res) => {
    //     if (res.meta.status !== 200) {
    //       return this.$message.error('删除记录失败！')
    //     }
    //     this.$message.success('删除记录成功！')
    //     this.getTableList()
    //   })
    async deleteRecordById (id) {
      // 弹框询问用户是否删除数据
      const confirmResult = await this.$confirm('此操作将永久删除记录, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).catch(err => err)
      // 如果用户确认删除，返回值为字符串confirm
      // 如果用户取消删除，返回值未字符串cancel
      // console.log(confirmResult)
      if (confirmResult !== 'confirm') {
        return this.$message.info('已经取消删除')
      }
      this.deleteNow.ids = id

      const { data: res } = await this.$http.post("EquipmentinfofileAction/deleteByIds", this.deleteNow)
      if (!res.success) return this.$message.error('删除记录失败！')
      this.$message.success('删除记录成功！')
      this.getTableList()

    },



    // 修改switch开关状态（当前记录）
    async switchStateChanged (recordinfo) {
      console.log(recordinfo)
      await modifySwitch(recordinfo.id, recordinfo.state).then((res) => {
        if (res.data.code !== 200) {
          recordinfo.state = !recordinfo.state
          return this.$message.error('更新状态失败!')
        }
        this.$message.success('更新状态成功!')
      })

    },
    // 导出表格
    async exportDataToExcel () {
      // 弹框询问用户是否导出表格
      const confirmResult = await this.$confirm('此操作将把数据为导出表格, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).catch(err => err)
      // 如果用户确认导出，返回值为字符串confirm
      // 如果用户取消导出，返回值未字符串cancel
      // console.log(confirmResult)
      if (confirmResult !== 'confirm') {
        return this.$message.info('已经取消导出')
      }

      window.open(axios.defaults.baseURL + '/EquipmentinfofileAction/exportDataToExcel?token=' + window.sessionStorage.getItem('token'))
      // const { date: res } = await this.$http.post("EquipmentinfofileAction/exportDataToExcel")
      // if (!res.success) return this.$message.error('导出表格失败')
      // this.$message.success('导出表格成功')
    },

  }

}


</script>
<style scoped>
</style>